{extend name="public/base"}

{block name="title"}就行天下-约酒交友{/block}

{block name="style"}
<link rel="stylesheet" href="__STATIC__/home/css/personal.css" />
{/block}

{block name="main"}
<div class="pageControl bg-f5">
    <div class="main-top"></div>
    <div class="msui_nav msui_navTop">
        <a class="msui_navTop-back" href="javascript:history.back();"><i class="micon-back"></i></a>
        <h1 class="msui_navTop-title">活动</h1>
        <a href="" class="msui_navTop-right msui_navTop-cnav"><i class="micon-cnav"></i></a>
    </div>
    <div>
        <div class="swiper-container">
            <div class="swiper-wrapper viewImage">
                {volist name="data.images" id="vo"}
                <div class="swiper-slide" style="height: 11rem;">
                    <a href="javascript:;" style="width:100%;"><img src="{$vo}" alt="{$vo}" class="viewPhone"  data-img="{$i - 1}" /></a>
                </div>
                {/volist}
            </div>
            <div class="swiper-pagination"></div>
        </div>
    </div>
    <div class="weui-cell weui-cell_access radiusImg">
        <div class="weui-cell__hd">
            <img src="{$data.headimgurl}" alt="">
        </div>
        <div class="weui-cell__bd">
            <p class="fs06">{$data.nickname}</p>
            <p class="fs06 cl-9999">{$data.application_time}</p>
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__bd">
            <p class="fs07"><span class="cl-315 fs065">{$data.schedule}</span></p>
            <p class="fs07"><span class="cl-315 fs065">{$data.time_remaining}</span></p>
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__bd">
            <p class="fs07">{$data.name}</p>
            <p class="fs06 cl-9999">已有<span class="cl-c40">{$data.num}</span>人参加
                (限<span class="cl-c40">{$data.population}</span>人)
                {in name="data.status" value="审核通过,未开始,正在进行"}
                    <a href="{:url('group_chat', ['id' => $data.id])}" class="cl-f45">进入群聊</a>
                {/in}
            </p>
        </div>
        <div class="weui-cell__ft">
            <span class="cl-315 fs065">{$data.is_aa}</span>
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__bd">
            <p class="fs07">我的状态：<span class="cl-315 fs065">{$data.member_status}</span></p>
        </div>
    </div>
    <div class="plr05 bg-fff mr-bottom30">
        <p class="cl-9999 mtop01">活动时间 <span>{$data.start_time|date="Y-m-d H:i:s",###}</span></p>
        <p class="cl-9999">地址: <span>{$data.address}</span></p>
        <p class="cl-9999">活动说明: <span>{$data.msg}</span></p>
    </div>
    {notempty name="data.product_name"}
    <div class="exercise">
        <p class="fs06 cl-f mb03 ">活动赞助</p>
        <div class="exercise-main">
            <div class="swiper-container1">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <div class="hdTitle">
                            <p class="fs06">{$data.product_name}</p>
                        </div>
                        <p class="cl-9999 fs06">活动实际参与人数达到<span>{$data.sponsor_num}</span>人，可免费使用赞助商品</p>
                        <div>

                            <img src="{$data.product_image}" alt="">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {/notempty}
    <!--<div class="my-flex exerciseBtn">-->
        <!--<a href="javascript:;" class="repulse cl-f fs065 bg-5c i_want_to_participate">我要参加</a>-->
    <!--</div>-->
    {empty name="data.pay_time"}
        <div class="my-flex exerciseBtn">
            <a href="{:url('order/pay')}?model=activity&id={$data.id}" class="repulse cl-f fs065 bg-c40">立即支付</a>
        </div>
    {else /}
        {eq name="data.status" value="已结束"}
            <div class="my-flex exerciseBtn">
                <a href="javascript:;" class="repulse cl-f fs065 bg-5c" onclick="$.toptip('活动已结束');">已结束</a>
            </div>
        {else /}
            {eq name="data.member_status" value="发起者"}
                <div class="my-flex exerciseBtn">
                    <a href="{:url('activity_member', ['id' => $data['id']])}" class="repulse cl-f fs065 bg-c40">查看活动参与者</a>
                </div>
            {else /}
                {eq name="data.member_status" value="未申请"}
                    <div class="my-flex exerciseBtn">
                        <a href="javascript:;" data-id="{$data.id}" class="repulse cl-f fs065 bg-c40 i_want_to_participate">我要参加</a>
                    </div>
                {else /}
                    <div class="my-flex exerciseBtn">
                        {eq name="data.member_status" value="审核通过"}
                            {eq name="data.member_registration" value="0"}
                            <a href="javascript:;" data-id="{$data.id}" class="repulse cl-f fs065 bg-c40 activity_registration">签到</a>
                            {/eq}
                        {/eq}
                        <a href="javascript:;" class="repulse cl-f fs065 bg-ffa quit_activity" data-id="{$data.id}">退出活动</a>
                    </div>
                {/eq}
            {/eq}
        {/eq}
    {/empty}
</div>
{/block}

{block name="javascript"}
<script src="__STATIC__/home/jquery_weui/js/swiper.min.js"></script>
<script src="__STATIC__/home/js/activity.js"></script>
<script>
    SCOPE.participate_activity_url = "{:url('participate')}"; // 定义参加活动url
    SCOPE.quit_activity_url = "{:url('quit_activity')}";  // 退出活动按钮

    $(function () {
        $('.siginBtn').click(function (e) {
            e.preventDefault();
            $(this).addClass('active');
        });
        $('.login-btn1').click(function () {
            $(this).attr('disabled','disabled');
        });
        var swiper = new Swiper('.swiper-container', {
            pagination: '.swiper-pagination',
            slidesPerView: 1,
            loop:true,
            paginationClickable: true,
            spaceBetween: 5,
            autoplay:3000
        });
        var swiper = new Swiper('.swiper-container1', {
            slidesPerView: 'auto',
            spaceBetween: 5,
        });
    });
</script>
{/block}